<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="demo">
			<h2>让 AJAX 更改这段文本</h2>
			<button type="button" onclick="loadDoc()">更改文本</button>
		</div>
		<script>
			// Function loadDoc()

			function loadDoc() {
				var xhttp = new XMLHttpRequest();
				xhttp.onreadystatechange = function() { //onreadystatechange:定义当 readyState 属性发生变化时被调用的函数
					if (this.readyState == 4 && this.status == 200) {
						//readyState：用于保存XMLHttpRequest的状态。0-请求未初始化；1-服务器链接已建立；2-请求已收到；3-正在处理请求；4-请求已完成且响应已就绪；
						document.getElementById("demo").innerHTML = this.responseText; //responseText：以字符串返回相应数据
					}
				};
				xhttp.open("GET", "ajax_info.txt", true); //open：规定请求
				xhttp.send(); //send()：将请求发送到服务器，使用GET请求
			}
		</script>
	</body>
</html>
